
<!--       ProductTypemgr产品类型 -->
<template>
  <a-card
    :bordered="false"
    :body-style="{ 'padding-bottom': '0px' }"
    :style="{ margin: '6px' }"
  >
    <a-form
      ref="searchFormRef"
      name="advanced_search"
      :model="searchFormState"
      class="ant-advanced-search-form"
    >
      <a-row :gutter="24">
        
        <a-col :span="6">
          <a-form-item label="产品类型名称" name="PTName">
            <a-input
              v-model:value="searchFormState.PTName"
              placeholder="请输入产品类型名称"
              @keyup.enter="tableRef.refresh(true)"
            />
          </a-form-item>
        </a-col>
        <a-col :span="6">
          <a-form-item label="产品类型编号" name="PTNo">
            <a-input
              v-model:value="searchFormState.PTNo"
              placeholder="请输入产品类型编号"
              @keyup.enter="tableRef.refresh(true)"
            />
          </a-form-item>
        </a-col>
        <a-col :span="6">
          <a-button class="mr10" type="primary" @click="tableRef.refresh(true)"
          v-show="hasRole(route.meta.RolePower)">查询</a-button
          >
          <a-button class="xn-mg08" @click="reset" v-show="hasRole(route.meta.RolePower)">重置</a-button>
        </a-col>
      </a-row>
    </a-form>
  </a-card>
  <a-card :bordered="false" :style="{ margin: '6px' }">
    <m-table
      :show-pagination="true"
      ref="tableRef"
      :columns="columns"
      :data="loadData"
      :alert="options.alert.show"
      bordered
      :row-key="(record) => record.ID"
      :tool-config="toolConfig"
      :row-selection="options.rowSelection"
    >
      <template #operator>
        <a-space>
          <a-button type="primary" @click="formRef.onOpen()" v-show="hasAddRole(route.meta.RolePower)">
            <template #icon><plus-outlined /></template>
            新增
          </a-button>
        </a-space>
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.dataIndex === 'action'">
          <a-space>
            <a-button type="link" @click="formRef.onOpen(record)" v-show="hasEditRole(route.meta.RolePower)">编辑</a-button>
            <a-divider type="vertical" />
            <a-popconfirm
              placement="topRight"
              title="确定删除？"
              @confirm="deleteModule(record)"
              ok-text="确定"
              cancel-text="关闭"
            >
              <a-button type="link" danger size="small" v-show="hasDeleteRole(route.meta.RolePower)">删除</a-button>
            </a-popconfirm>
          </a-space>
        </template>
      </template>
    </m-table>
  </a-card>
  <Form ref="formRef" @successful="tableRef.refresh(true)" />
</template>

<script setup name="producttypemgr">

import Form from "./form.vue";
import { message } from "ant-design-vue";
import producttypemgrApi from "@/api/productManagement/producttypemgrApi";
import { useRoute } from "vue-router";
const route = useRoute();


const searchFormState = ref({
  ID: 0,
  PTName: "",
  PTNo: "",
});
const formRef = ref();
const searchFormRef = ref();
const tableRef = ref();
const toolConfig = {
  refresh: true,
  height: true,
  columnSetting: false,
  striped: false,
};
const columns = [
  {
    title: "产品类型名称",
    dataIndex: "ProductTypeName",
    align: "center",
  },
  {
    title: "产品类型编号",
    dataIndex: "ProductTypeNo",
    align: "center",
  },
  {
    title: "产品类型说明",
    dataIndex: "ProductTypeDesp",
    align: "center",
  },
  {
    title: "操作",
    dataIndex: "action",
    align: "center",
    width: "200px",
  },
];
// 列表选择配置
const options = {
  alert: {
    show: false,
    clear: () => {},
  },
};
const loadData = (parameter) => {
  return producttypemgrApi
    .getProductTypes(Object.assign(parameter, searchFormState.value))
    .then((res) => {
      return res;
    });
};
// 重置
const reset = () => {
  searchFormRef.value.resetFields();
  tableRef.value.refresh(true);
};
// 删除
const deleteModule = (record) => {
  let params = {
    ID: record.ID,
    PTName: record.ProductTypeName,
  };
  producttypemgrApi.deleteProductType(params).then(() => {
    tableRef.value.refresh();
    message.success("删除成功");
  });
};
</script>
